<template>
  <page-card title="暂存消息监控">
    <div class="public-list">
      <div class="public-list-tools">
        <a-row type="flex"
               style="margin-bottom:20px"
               justify="start">
          <a-col flex="1">
          </a-col>
          <a-col>
            <a-input-search v-model="params.keyword"
                            placeholder="关键字"
                            allow-clear
                            @search="search" />
          </a-col>
        </a-row>
      </div>
      <div class="public-list-panel">
        <a-table :columns="columns"
                 :data-source="dataList"
                 :rowKey="(item, index) => index"
                 @change="handleTableChange"
                 :pagination="pagination">
          <span slot="action"
                slot-scope="text, item">
            <template>
              <a @click="handleRepeat(item.id)">重发</a>
            </template>
          </span>
        </a-table>
      </div>
    </div>
  </page-card>
</template>

<script>
import { PAGINATION } from '../../../constants'
import { getMqCacheList, getMqCacheInfoById, sendMqCacheById } from '../../../api/exchanger/monitor'
export default {
  name: 'TemporaryMonitorList',
  data () {
    return {
      params: {
        keyword: ''
      },
      pagination: PAGINATION,
      dataList: [],
      columns: [
        {
          title: '序号',
          width: 100,
          align: 'center',
          dataIndex: 'index',
          key: 'index',
          customRender: (text, record, index) => `${index + 1}`
        },
        {
          title: '任务名称',
          align: 'center',
          dataIndex: 'mqName',
          ellipsis: true
        },
        {
          title: '发送应用',
          align: 'center',
          dataIndex: 'sendUserName',
          ellipsis: true
        },
        {
          title: '接收应用',
          align: 'center',
          dataIndex: 'receiveUserName',
          ellipsis: true
        },
        {
          title: '发送状态',
          width: 100,
          align: 'center',
          dataIndex: 'status',
          ellipsis: true,
          customRender: (text, row, index) => {
            if (text) {
              return <span style="color: #70b603;">成功</span>
            } else {
              return <span style="color: #d9001b;">暂存</span>
            }
          }
        },
        {
          title: '发送次数',
          width: 120,
          align: 'center',
          dataIndex: 'sendNum',
          ellipsis: true
        },
        {
          title: '路由',
          align: 'center',
          dataIndex: 'exchangeName',
          ellipsis: true
        },
        {
          title: '创建时间',
          align: 'center',
          dataIndex: 'createTime',
          ellipsis: true
        },
        {
          title: '操作',
          width: 80,
          align: 'center',
          scopedSlots: { customRender: 'action' }
        }
      ]
    }
  },
  created () {
    this.getList()
  },
  methods: {
    // 搜索
    search () {
      this.dataList = []
      this.pagination.current = 1
      this.getList()
    },
    // 重置
    reset () {
      this.params = {
        zyName: '',
        xxName: ''
      }
      this.pagination.current = 1
      this.getList()
    },
    // 列表数据
    getList () {
      let par = {
        currPage: this.pagination.current,
        pageSize: this.pagination.pageSize,
        keyword: this.params.keyword
      }
      getMqCacheList(par).then(res => {
        this.dataList = res.list || []
        this.pagination.current = res.currPage
        this.pagination.total = res.totalCount
        this.pagination.pageSize = res.pageSize
      })
    },
    // 重发
    handleRepeat (id) {
      sendMqCacheById(id).then(res => {
        this.message.info(res)
        this.getList()
      }).catch((e) => { })
    },
    // 分页、排序、筛选变化时触发
    handleTableChange (pagination, filters, sorter) {
      this.pagination = pagination
      this.getList()
    }
  }
}
</script>

<style lang="less" scoped>
</style>